<template>
	<view class="cont">
		<view class="tjgood" @click="ontype()">
			<view class="tjgoodimg">
				<image :src="goodsInfo.banner_list[0].banner_img_path" mode="scaleToFill"></image>
			</view>
			<view class="tjgoodText">
				<view class="tjgoodTextname">{{goodsInfo.product_name}}</view>
				<view class="tjgoodPrice">
					<text class="red fontBoldss">￥{{goodsInfo.local_shop_price||''}}</text>
					<text class="huaxian">价格￥{{goodsInfo.market_price||''}}</text>
				</view>
			</view>
		</view>
		<view class="tjgoodlist">
			<u-divider text="为您推荐更多商品"></u-divider>
			<sheet-recommend ref="getXgjgoodlist"></sheet-recommend>
		</view>
	</view>
</template>

<script>
	import {
		goodsDetail
	} from "@/api/index.js"
	import sheetRecommend from "@/components/sheet/sheetRecommend.vue"
	export default {
		data() {
			return {
				goods_id:'',
				goodsInfo:{}
			}
		},
		components: {
			sheetRecommend
		},
		onLoad(option) {
			this.goods_id = option.id;
			this.getGoods();
			this.$refs.getXgjgoodlist.getRecommendlist();
		},
		onReady() {
		
		},
		methods: {
			//跳转详情
			ontype(){
				let e = this.goodsInfo;
				uni.navigateTo({
					url: '/package/info/index?id='+e.id+'&title='+e.product_name
				});
			},
			//获取当前商品
			getGoods(data) {
				goodsDetail({
					goods_id: this.goods_id
				}).then(res => {
					this.goodsInfo = res.result;
				}).catch(err => {
					uni.showToast({
						title: err.msg,
						icon: "none"
					})
				})
			},
		}
	}
</script>

<style lang="less">
	page {
		background: #f2f2f2!important;
		// background-color: #f2f2f2;
	}
	.cont{
		width: 100%;
		margin: 0 auto;
		.tjgoodlist{
			width: 95%;
			margin: 0 auto;
			padding-top: 160rpx;
		}
		.tjgood{
			width: 95%;
			margin: 0 auto;
			padding: 10px 2.5%;
			display: flex;
			justify-content: space-between;
			background: #fff;
			box-shadow:0 5px 5px #ededed;
			position: fixed;
			left: 0;
			top: 0;
			z-index: 11;
			.tjgoodimg{
				width: 120rpx;
				height: 120rpx;
				image{
					display: block;
					width: 100%;
					height: 100%;
				}
			}
		}
		.tjgoodText{
			width: 80%;
			
			.tjgoodTextname{
				color: #333;
				font-size: 14px;
				height: 40px;
				line-height: 20px;
				 overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
			}
			.tjgoodPrice{
				font-size: 14px;
				text:nth-child(2){
					color: #a0a1a3;
					font-size: 12px;
				}
			}
		}
		
	}
</style>
